<template>
  <el-dialog :visible.sync="visible" width="60%" :close-on-click-modal="false" @close="$emit('close')">
    <div slot="title" class="header flex-between">
      人员
    </div>
    <div>
      <!-- 表单 -->
      <div class="content">
        <el-tabs v-model="activeName">
          <el-tab-pane label="基本信息" name="first">
            <ZfwFormAdd :formData="baseFormData" :fileds="baseFileds" ref="formAddRef">
            </ZfwFormAdd>
          </el-tab-pane>
          <el-tab-pane label="职务信息" name="second">
            <ZfwFormAdd :formData="postFormData" :fileds="postFileds" ref="formPostRef">
            </ZfwFormAdd>
          </el-tab-pane>
          <el-tab-pane label="其他信息" name="third">
            <ZfwFormAdd :formData="otherFormData" :fileds="otherFileds" ref="formOtherRef">
            </ZfwFormAdd>
          </el-tab-pane>
        </el-tabs>
        <div class="flex-rowc mt10">
          <el-button @click="$emit('close')">取消</el-button>
          <el-button type="primary" @click="handleSubmit">保存</el-button>
        </div>
      </div>
    </div>
  </el-dialog>
</template>
<script>
import ZfwFormAdd from "@/components/zfw-common/zfw-form-add/index"
import Mixin from "../config/addMixin.js"
import { limitAdd, limitDetail, limitEdit } from "@/api/personmanagement.js"
import { replaceFormData } from "@/utils/common.js"
export default {
  name: "add-page",
  mixins: [Mixin],
  components: { ZfwFormAdd },
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    type: {
      type: String,
      default: ""
    },
    personId: {
      type: String,
      default: ""
    }
  },
  data() {

    return {
      baseFormData: {
        userType: 0,
        name: "",
        account: "",
        password: "123456",
        password1: "123456",
        mobile: "",
        email: "",
        status: 0
      },
      postFormData: {
        deptId: "",
        positionType: 0,
        positionName: "",
        positionOrderNo: ""
      },
      otherFormData: {
        code: "",
        workDate: "",
        birthday: "",
        sex: 0,
        workTel: "",
        homeTel: "",
        linkman: "",
        linkmanTel: "",
        homeAddres: ""
      },
      activeName: 'first'
    }
  },
  mounted() {
    if (this.personId) {
      this.getDetail()
    }
  },
  methods: {
    // 校验手机号码
    checkPhone(value) {
      if (value) {
        if (!/^1[3-9]\d{9}$/.test(value)) {
          this.$message.error("请输入正确的手机号码")
          return false
        }
      }
      return true
    },
    checkMobile(value) {
      const mobileReg = /^1[3-9]\d{9}$/;
      const landlineReg = /^(0\d{2,3})-?(\d{7,8})$/;
      if (value) {
        if (!mobileReg.test(value) && !landlineReg.test(value)) {
          this.$message.error("请输入正确的号码")
          return false
        }
      }
      return true
    },
    // 获取详情
    async getDetail() {
      const { code, data } = await limitDetail({ personId: this.personId })
      if (code === 200) {
        for (const key in this.baseFormData) {
          this.baseFormData[key] = data[key]
        }
        for (const key in this.postFormData) {
          this.postFormData[key] = data[key]
        }
        for (const key in this.otherFormData) {
          this.otherFormData[key] = data[key]
        }
        this.baseFormData.password = "123456"
        this.baseFormData.password1 = "123456"
      }
    },

    async handleSubmit() {
      const valid1 = await this.$refs.formAddRef.validate()
      const valid2 = await this.$refs.formPostRef.validate()
      const valid3 = await this.$refs.formOtherRef.validate()
      const mobile = this.checkPhone(this.baseFormData.mobile)
      const workTel = this.checkMobile(this.otherFileds.workTel)
      const homeTel = this.checkMobile(this.otherFileds.homeTel)
      const linkmanTel = this.checkMobile(this.otherFileds.linkmanTel)
      if (valid1 && valid2 && valid3 && mobile && workTel && homeTel && linkmanTel) {
        const params = {
          ...this.baseFormData,
          ...this.postFormData,
          ...this.otherFormData,
          id: this.personId,
        }
        if (Array.isArray(params.deptId)) {
          const arr = params.deptId.slice(-1)
          params.deptId = arr[0]
        }
        let res = null
        if (this.type === 'add') {
          res = await limitAdd(replaceFormData(params))
        }
        if (this.type === 'edit') {
          res = await limitEdit(replaceFormData(params))
        }
        if (res.code === 200) {
          this.$message.success("操作成功")
          this.$emit('confrim')
        }
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.content {
  height: 450px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
</style>
